<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<!-- 
  - Author(s): Lloyd
  - Date: 2014-06-13 14:20:49
  - Description:
-->
<head>
	<style type="text/css">
	a:link {
	    color:#0000FF;
	    text-decoration:underline;
	}
	a:visited {
	    color:#0000FF;
	    text-decoration:underline;
	}
	a:hover {       
	    color:#0000FF;
	    text-decoration:underline;
	}
	a:active {
	    color:#0000FF;
	    text-decoration:underline;
	}
	</style>
	
	<%@include file="/common.jsp"%>
	<%@include file="/common/common.jsp"%>
	<%@include file="/coframe/tools/skins/common.jsp" %>
	<title>选择下一环节及审批（阅）人</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<script src="<%= request.getContextPath() %>/common/nui/nui.js" type="text/javascript"></script>
</head>
<body style="overflow:hidden;" >
	<div class="nui-fit" style="margin:5px 5px 0px 5px;">
		<table style="height:100%;border-bottom-style:none;">
	    	<tr style="height:98%;">
	        	<td style="width:240px;height:500px;" valign="top">
					<div id="panel1" class="nui-panel" title="选择机构" style="width:100%;height:100%;">
			        	<ul id="tree1" class="nui-tree" style="width:100%;" url="org.gocom.components.coframe.org.organization.getOrgStaticTree.biz.ext"
		                	dataField="treeNodes" showTreeIcon="true" textField="nodeName" idField="nodeId" resultAsTree="false" parentField="parentId"
		                	onNodeclick ="onclick" >
		                </ul>
	               	</div>
	 			</td>
	
	            <td style="width:260px;height:500px;text-align:center;" valign="top">
	                <div id="panel2" class="nui-panel" title="选择人员" style="width:100%;height:100%;">
	                    <div class="nui-fit">
	                        <%--<div style="width:100%;height:8%;">
	                            <label>名称：</label>
	                            <input id="key" class="nui-textbox" style="width:120px;" onenter="onKeyEnter"/>
	                            <a class="nui-button" style="width:60px;" onclick="searchByType()">查询</a> 
	                        </div>--%>
	                        <div style="width:100%;height:100%;">
	                            <div id="datagrid1" class="nui-datagrid" showPager="false" style="width:100%;height:100%;" allowResize="true" dataField="emps" pageSize="20" sizeList=[10,20,25,50]
	                            	url="" idField="empid" multiSelect="true" onRowdblclick="dbclickRow" >
	                                <div property="columns">
	                                    <div type="checkcolumn" width="30"></div>
	                                    <div field="orgid" visible="false">组织号</div>
	                                    <div field="orgname" visible="false">组织</div>
	                                    <div field="userid" width="100" headerAlign="center" visible="false" align="center" allowSort="false">工号</div>
	                                    <div field="operatorid" width="100" headerAlign="center" visible="false" align="center" allowSort="false">号</div>
	                                    <div field="empname" width="100" headerAlign="center" align="center" allowSort="false">姓名</div>
	                                </div>
	                            </div>
	                        </div>
	                    </div>
	                </div>
	            </td>
	
	            <td style="width:100px;height:500px;text-align:center;" valign="middle">
	                <input class="nui-button" iconCls="icon-downgrade" text="添加 " onclick="addNewNodes()" style="width:90px;margin-top:5px;"/><br />
	                <input class="nui-button" iconCls="icon-upgrade" text="移除 " onclick="removeNodes()" style="width:90px;margin-top:5px;"/><br />
	                <input class="nui-button" iconCls="icon-no" text="全部移除" onclick="removeAll()" style="width:90px;margin-top:5px;"/><br />
	                <br /><br />
	                <input class="nui-button" iconCls="icon-ok" text="确定" onclick="confirmSelection()" style="width:90px;margin-top:5px;"/><br />
	            </td>
	
	            <td style="width:300px;height:500px;" valign="top">
	                <div id="partiListbox" class="nui-listbox" style="width:100%;height:100%;" onitemdblclick="removeCurrentNode"
	                    textField="empname" valueField="empid" multiSelect="true" showCheckBox="true" >
	                    <div property="columns">
	                    	<div field="orgname" align="center" headerAlign="center">
	                    		组织
	                    	</div>
	                        <div align="center" headerAlign="center" field="empname">
	                    		已选择人员
	                    	</div>
	                        <div width="50px" align="center" headerAlign="center" field="col_del" renderer="renderDelColumn">
	                        	操作
	                        </div>
	                    </div>
	                </div>
	            </td>
	        </tr>
	    </table>
	</div>
	<script type="text/javascript">
	    nui.parse();
	    
	    //var ltree = nui.get("partiTree"); //未找到 
	    var rlistbox = nui.get("partiListbox");//已选择人员
	    var grid = nui.get("datagrid1");//选择人员
	    //var multiSelect = 'true';
	   	
	    // 点击节点触发事件
	    var orgurl  = "com.shendong.mis.OrgUser.queryPersonByOrg.biz.ext";
	    var selectedNode;
	    
	    // 未找到
	    function onNodeSelected(e){ 
			grid.setUrl(orgurl);
		    grid.load({'roleID':e.node.nodeId});
	    }
	    
	    // 选择机构--点击事件
	    function onclick(e){
	        grid.setUrl(orgurl);
		    grid.load({'orgId':e.node.nodeId});
	    }
	    
	    // 未找到
	    function click(e){
	        grid.setUrl(orgurl);
		    grid.load({'roleID':e.row.roleId});
	    }
	
	    // 页面加载时自动跳到指定节点
	    /* function autoExpandOrgNode(){
	        var json = nui.encode({foo:'foo'});
	        nui.ajax({
	            url:"com.cd.cg.bpm.partiSelection.SearchManager.queryOrganizationByUserid.biz.ext",//未找到。。。
	            type:'POST',
	            data:json,
	            cache:false,
	            async:true,
	            contentType:'text/json',
	            success:function(text){
	                var targetNode = text.nodeid;
	                ltree.selectNode(targetNode);
	                ltree.expandPath(targetNode);
	            }
	        });
	    } */
	
	    // 双击某行就调用增加
	    function dbclickRow (e) {
	        addNewNodes();
	    }
	    
	    // 增加选中的节点
	    function addNewNodes(){
	        var rows = grid.getSelecteds();
	        if(rows){
	            for(var i = 0;i<rows.length;i++){
	                var currow = rows[i];
	                var count = rlistbox.getCount();
	                var allList = rlistbox.getData();
	                var hasValue = false;
	                for(var j=0;j<allList.length;j++){
	                	if(allList[j].empname==currow.empname){
	                		hasValue = true;
	                	}
	                }
	               	if(!hasValue){
	               		rlistbox.addItem(currow,count+1);
	               	}
	        	}
	      	}
	   	}
	   
	   	// 该方法已注释
	   	function searchByType(){
	        var username = nui.get('key').getValue();
	        var orgid = selectedNode.nodeid;
	
	        if(orgid){
	            var crit = {
	                'orgid' : orgid,
	                'username': username
	            };
	            grid.load(crit);
	        }else{
	            alert("请选择一个机构！");
	        }
	    }
	    
	    // 移除选中的节点
	    function removeNodes() {
	        var items = rlistbox.getSelecteds();
	        if(items && items.length > 0){
	            rlistbox.removeItems(items);
	        }else{
	            nui.alert("请选择至少一条记录","提示");
	        }
	    }
	    
	    // “全部移除”按钮调用函数
	    function removeAll() {
	        rlistbox.removeAll();
	    }
	    
	    // 确认选择
	    function confirmSelection() {
	    	var items = rlistbox.data;
       		if(items.length > 1){
       			//if(multiSelect == 'true'){
                	CloseWindow('ok');
       			//}else{
       			//	nui.alert("只能选择一个人！","提示");
       			//}
            }else if(items.length == 1){
                CloseWindow('ok');
            }else{
                nui.alert("请选择至少一条记录","提示");
            }
	    }
	    
	    // 已选择人员-操作移除
	    function renderDelColumn(e) {
	    	var index = rlistbox.indexOf(e.record);
	        var s =  '<a class="link_delete" href="javascript:removeNode('+index+')">移除</a> ';
	        return s;
	    }
	    
	    // 移除选中的节点
	    function removeCurrentNode(e) {
	        var item = e.item;
	        var arr = [];
	        if(item){
	        	arr.push(item);
	            rlistbox.removeItems(arr);
	        }else{
	            nui.alert("请选择至少一条记录","提示");
	        }
	    }
		
		// 移除选中的节点 单个移除用
	    function removeNode(index) {
	        var item = rlistbox.getAt(index);
	        var arr = [];
	        if(item){
	        	arr.push(item);
	            rlistbox.removeItems(arr);
	        }
	    }
	   
	    // 关闭窗体
	    function close(){
	        CloseWindow("close");
	    }
	    
	    // 关闭事件
	    function CloseWindow(action){
	      if(window.CloseOwnerWindow) 
	        return window.CloseOwnerWindow(action);
	      else
	        return window.close();
	    }
	    
	    // 下面两个方法是与页面做交互的
	    // 获取选中的参与者
	    function GetData() {
	        var res = rlistbox.data;
	        /* var userdata = [];
	        var orgid="";
	        var orgname="";*/
	        var empid="";
	        var username="";  //用于弹出提示 
	        var operatorid="";  //用于弹出提示
	        for(var i = 0 ;i<res.length ;i++){
	            /* var currParti = {
	            	//'orgid' : res[i].orgid,
	            	//'orgname' : res[i].orgname,
	                //'empname' : res[i].empname,
	                //'empid'   : res[i].empid,
	                //'typeCode': 'emp'
	            }; */
	            //userdata.push(currParti);
	        	//orgid=orgid+res[i].orgid+",";
	        	empid=empid+res[i].empid+",";
	        	username=username+res[i].empname+",";
	        	operatorid=operatorid+res[i].operatorid+",";
	        }
	        /* orgid=orgid.substring(0,orgid.length-1);
	        orgname=orgname.substring(0,orgname.length-1); */
	        empid=empid.substring(0,empid.length-1);
	        username=username.substring(0,username.length-1);
	        operatorid=operatorid.substring(0,operatorid.length-1);
	        useridArray=res;
	        //var rtnData = {'userdata':userdata,'orgid':orgid,'orgname':orgname,'username':username,'userid':userid};
	        var rtnData = {'empid':empid,'username':username,'operatorid':operatorid,'useridArray':useridArray};
	       
	        return rtnData;
	    }
	    
	    // 页面数据取得
		function SetData(data) {
			data = nui.clone(data);
			/* if( data.multiSelect != null || data.multiSelect != ''){
	        	multiSelect = data.multiSelect;
	        } */
			if(data.empids !=null && data.empids != ""){
				var json = nui.encode({empId:data.empids});
		        nui.ajax({
		            url:"com.shendong.mis.OrgUser.queryEmpByEmpIds.biz.ext",
		            type:'POST',
		            data:json,
		            cache:false,
		            async:true,
		            contentType:'text/json',
		            success:function(text){
		            	rlistbox.addItems(text.emps);
		            }
        		});
			}     
			// 判断是否存在传参
			/* if(data.ids !=null && data.ids != ""){
				var orgids=new Array();
				var orgnames=new Array();
				var ids = new Array();
				var texts = new Array();
				// 判断是否多人拼接
				if(data.ids.indexOf(',')>-1){
					orgids = data.orgids.split(",");
					orgnames = data.orgnames.split(",");
					ids = data.ids.split(",");
					texts = data.texts.split(",");
				}else{
					orgids[0] = data.orgids;
					orgnames[0] = data.orgnames;
					ids[0] = data.ids;
					texts[0] = data.texts;
				}
				var count = rlistbox.getCount();
				// 循环添加已选人员
				for(var i=0;i<ids.length;i++){
					var orgid = orgids[i];
					var orgname = orgnames[i];
					var id = ids[i];
		        	var text = texts[i];
			        var currow ={
			        	orgid:orgid,
			        	orgname:orgname,
		            	empid:id,
		            	empname:text
			        };
			        rlistbox.addItem(currow,count+1);
		    	}
			} */
		}
	   	    
	</script>
</body>
</html>